<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="/jquery-easyui-1.7.0/themes/default/easyui.css">
    <link rel="stylesheet" type="text/css" href="/jquery-easyui-1.7.0/themes/icon.css">
    <script type="text/javascript" src="/jquery-easyui-1.7.0/jquery.min.js"></script>
    <script type="text/javascript" src="/jquery-easyui-1.7.0/jquery.easyui.min.js"></script>
</head>
<body>
<table id="dg"></table>

<div id="add-dialog" class="easyui-dialog" data-options="closed:true,iconCls:'icon-save'"
     style="width:500px; padding:10px;">
    <form id="menu-form" method="post">
        <table cellpadding="5">
            <tr>
                <td align="right">名 称:</td>
                <td><input type="text" name="title" data-options="required:true" class="easyui-textbox"
                           style="width:260px"/></td>
            </tr>
            <tr>
                <td align="right">路 径:</td>
                <td><input type="text" name="url" class="wu-text"/></td>
            </tr>
            <tr>
                <td align="right">父节点:</td>
                <td><input type="text" name="parent" class="wu-text"/></td>
            </tr>
            <tr>
                <td valign="top" align="right">说 明:</td>
                <td><textarea name="remark" rows="6" class="wu-textarea" style="width:260px"></textarea></td>
            </tr>
        </table>
    </form>
</div>


<script type="text/javascript">
    $('#dg').datagrid({
        loadMsg: '正在加载中',
        url: 'menu/list',
        singleSelect:true,
        columns: [[
            {field: 'createDate', title: '创建时间',formatter:''},
            {field: 'title', title: '名称'},
            {field: 'url', title: '路径'}
        ]],
        toolbar: [{
            text: 'Add',
            iconCls: 'icon-add',
            handler: function () {
                openDialog();
            }
        }, {
            text: 'Cut',
            iconCls: 'icon-cut',
            handler: function () {
                alert('cut')
            }
        }],
        pagination: true
    });

    function openDialog() {
        $('#menu-form').form('clear');
        $('#add-dialog').dialog({
            closed: false,
            modal: true,
            title: "添加信息",
            buttons: [{
                text: '确定',
                iconCls: 'icon-ok',
                handler: add
            }, {
                text: '取消',
                iconCls: 'icon-cancel',
                handler: function () {
                    $('#add-dialog').dialog('close');
                }
            }]
        });
    }

    function add() {
        $('#menu-form').form('submit', {
            url: 'menu/save',
            success: function (data) {
                if (data) {
                    $.messager.alert('信息提示', '提交成功！', 'info');
                    $('#add-dialog').dialog('close');
                }
                else {
                    $.messager.alert('信息提示', '提交失败！', 'info');
                }
            }
        });
    }
</script>
</body>
</html>